<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>所有病房信息</title>
    <link
            rel="stylesheet"
            href="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/css/mdui.min.css"
            integrity="sha384-cLRrMq39HOZdvE0j6yBojO4+1PrHfB7a9l5qLcmRm/fiWXYY+CndJPmyu5FV/9Tw"
            crossorigin="anonymous"
    />
    <script
            src="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/js/mdui.min.js"
            integrity="sha384-gCMZcshYKOGRX9r6wbDrvF+TcCCswSHFucUzUPwka+Gr+uHgjlYvkABr95TCOz3A"
            crossorigin="anonymous"
    ></script>
    <meta name="renderer" content="webkit" >
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <base href="<%=url%>">
    <script src="https://lib.baomitu.com/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://lib.baomitu.com/layui/2.6.5/layui.min.js"></script>
    <link href="https://lib.baomitu.com/layui/2.6.5/css/layui.min.css" rel="stylesheet">
    <style>
        #input-limit{
            height: 30px;
            background-color: #1e9fff;
            color: whitesmoke;
            width: 60px;
            border:1px #1e9fff;
            border-radius: 4px;
        }
        #input-limit:hover{
            background-color:#bbdaff;
        }
    </style>
</head>
<body>
<div class="layui-main">
    <blockquote class="layui-elem-quote">住院信息</blockquote>
    <a style="margin-left: 50px"><span style="font-size: 18px;margin-right: 10px">姓名:</span><input type="text" placeholder="请输入姓名" id="input-name" style="height: 30px"></a>
    <button id="input-limit">搜索</button>
    <hr/>
    <table id="tbl" lay-filter="tbl"></table>
    <script type="text/html" id="tbl-toolbar">
        <a class="layui-btn layui-btn-xs" lay-event="see" id="see">查看</a>
        <a class="layui-btn layui-btn-xs" lay-event="leave_hospital">出院</a>
    </script>
</div>
</body>
<script>
    layui.use(['jquery', 'table', 'layer', 'form'], function () {
        var $ = layui.$;
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        table.render({
            elem: '#tbl',
            url: '/open/queryOpenDB',
            method: 'get',
            initSort: { //排序
                field: 'account' //排序字段，对应 cols 设定的各字段名
                , type: 'asc' //排序方式  asc: 升序、desc: 降序、null: 默认排序
            },
            cols: [[
                {field: 'uid',title:'患者编号',},
                {field: 'uname', title: '患者姓名'},
                {field: 'sname', title: '病房区域'},
                {field: 'lengthdate', title: '住院时间',templet: "<div>{{layui.util.toDateString(d.lengthdate, 'yyyy-MM-dd')}}</div>", width: 130},
                {field: 'name', title: '主治医生'},
                {field: 'status', title: '住院'},
                {toolbar: '#tbl-toolbar', title: '操作', width: 200}
            ]],

            page: {
                limit: 5,//指定每页显示的条数
                limits: [5, 10, 20, 40, 50, 60, 80, 100]//每页条数的选中
            }//开启分页
            , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据，res为从url中get到的数据
                var result;
                if (this.page.curr) {
                    result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
                } else {
                    result = res.data.slice(0, this.limit);
                }
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": result //解析数据列表
                };
            },
            done: function(res, curr, count){
                //如果是异步请求数据方式，res即为你接口返回的信息。
                //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
                //console.log(res);
                //得到当前页码
                //console.log(curr);
                //得到数据总量
                //console.log(count);
                $(".layui-table-box").find("[data-field='id']").css("display","none");
                $("[data-field='status']").children().each(function(){
                    if($(this).text()=='2'){
                        $(this).text("已出院");
                    }else if($(this).text()=='1'){
                        $(this).text("已住院").css("color","red");
                    }
                });
                pageCurr=curr;
            },
            // 表格容器id，用于表格重载
            id: 'tbl'
        });



        $("#input-limit").click(function () {
            var uname=$("#input-name").val();
            // var datt={"uid":uid,"uname":uname};
            table.render({
                elem: '#tbl',
                url: '/open/queryOpenDBByName?uname='+uname,
                method: 'get',
                initSort: { //排序
                    field: 'account' //排序字段，对应 cols 设定的各字段名
                    , type: 'asc' //排序方式  asc: 升序、desc: 降序、null: 默认排序
                },
                cols: [[
                    {field: 'uid',title:'患者编号',},
                    {field: 'uname', title: '患者姓名'},
                    {field: 'sname', title: '病房区域'},
                    {field: 'lengthdate', title: '住院时间',templet: "<div>{{layui.util.toDateString(d.lengthdate, 'yyyy-MM-dd')}}</div>", width: 130},
                    {field: 'name', title: '主治医生'},
                    {field: 'status', title: '住院'},
                    {toolbar: '#tbl-toolbar', title: '操作', width: 200}
                ]],

                page: {
                    limit: 5,//指定每页显示的条数
                    limits: [5, 10, 20, 40, 50, 60, 80, 100]//每页条数的选中
                }//开启分页
                , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据，res为从url中get到的数据
                    var result;
                    if (this.page.curr) {
                        result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
                    } else {
                        result = res.data.slice(0, this.limit);
                    }
                    return {
                        "code": res.code, //解析接口状态
                        "msg": res.msg, //解析提示文本
                        "count": res.count, //解析数据长度
                        "data": result //解析数据列表
                    };
                },
                done: function(res, curr, count){
                    $(".layui-table-box").find("[data-field='id']").css("display","none");
                    $("[data-field='status']").children().each(function(){
                        if($(this).text()=='2'){
                            $(this).text("已出院");
                        }else if($(this).text()=='1'){
                            $(this).text("已住院").css("color","red");
                        }
                    });
                    pageCurr=curr;
                },
                // 表格容器id，用于表格重载
                id: 'tbl'
            });
        });

        table.on('tool(tbl)', function (obj) {
            // 获取当前行数据和lay-event的值
            var data = obj.data;
            var event = obj.event;
            // 删除事件
            if (event === 'see') {
                $.get("/open/selectOpenDB?warid="+data.warid,function (data) {
                    // layer.msg(data.name);
                    layer.open({
                        title:'提示'
                        ,content:data.name
                    })
                })
            }

            if(event==='leave_hospital'){
                if(data.status==2){
                    layer.open({
                        title:'提示'
                        ,content:'该患者已出院'
                    })
                    return false;
                }

                layer.confirm("是否确认出院？",function () {
                    $.get("/open/updateStatus?warid="+data.warid,function (data) {
                        if(data==1){
                            layer.open({
                                title:'提示'
                                ,content:'出院办理成功'
                            })
                            setTimeout(function () {
                                table.reload('tbl');
                            },1500);
                        };
                    })
                })
            }
        });
    });
</script>
<script>
</script>
</html>